<template>
  <div>
    <van-nav-bar
      :right-text="rightText"
      :left-text="leftText"
      left-arrow
      @click-left="goBack"
      @click-right="edit"
    />
    <van-radio-group v-model="radio"  v-if="listData.length>0">
      <van-cell-group>
        <van-cell v-for="(item,index) in listData" :key="index" :title="item" clickable @click="choose(item, index)" >
          <van-radio :name="index"  v-if="!leftText" />
        </van-cell>
      </van-cell-group>
    </van-radio-group>
    <div v-else class="notice">尚未添加常用语</div>
    <div class="btn-box" v-if="!this.leftText && listData.length>0">
      <div class="weui-btn weui-btn_primary" :class="radio!==''?'':'weui-btn_disabled'" @click="save">保存</div>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        listData: [],
        radio: '',
        leftText: '我',
        rightText: '管理分组'
      }
    },
    methods: {
      getList() {
        this.listData = ['未分组','心脏病', '高血压']
      },
      choose(value, index) {
        this.radio = index
      },
      save() {

      },
      goBack() {
        
      },
      edit() {
        if(!this.leftText) {
          this.$router.push({name:'groupAdd',query: {fromChat: ''}})
        }else {
          this.$router.push({name:'groupEdit'})
        }
      }
    },
    created() {
      if(this.$route.query && this.$route.query.fromChat===null) {
        this.leftText = ''
        this.rightText = '+新增分组'
      }
      this.getList()
    }
  }
</script>
<style lang="stylus">
.notice {
  text-align: center;
  margin-top: 10rem;
}
.btn-box
  box-sizing: border-box
  width: 100%
  .weui-btn
    border-radius: 20px
    border: none
    width: 90%
    height: 37px
    text-align: center
    line-height: 37px
    margin: 20px auto 0
    color: #fff
    &.weui-btn_primary
      border: none
      background: #108ee9
    &.weui-btn_disabled
      border: none
      background: #c3e3f9
</style>